<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>赠送系统产品</title>
<meta name="decorator" content="default" />
<style type="text/css">
.ui-field-contain fieldset div.ui-input-text {
	float: left;
	width: 60%;
}
</style>

<script type="text/javascript">
	$().ready(function() {
		cashPro.loadingProductList("system");
		cashPro.validateInputForm("system", "productName");
		$("#inputForm").valid();
		disableExitMenu();
	});
</script>
</head>
<body>
	<div class="container">
		<div data-role="navbar">
			<ul>
				<li><a
					href="${ctx}/cash/member/gift/systemProduct/page?id=${member.customer.id}"
					class="ui-btn-active">系统产品</a></li>
				<li><a
					href="${ctx}/cash/member/gift/storeProduct/page?id=${member.customer.id}">店面产品</a></li>
			</ul>
		</div>
		<!--  系统产品-->
		<table id="contentTable" data-role="table"
			class="ui-responsive table-stroke">
			<thead>
				<tr>
					<th colspan="5" style="text-align:center;">已选产品</th>
				</tr>
				<tr>
					<th>产品名称</th>
					<th>产品规格</th>
					<th>数量</th>
					<th>零售价</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody id="tbody">
				<c:forEach items="${member.giftCart.systemProducts}"
					var="productCart">
					<tr id="${productCart.storeProduct.id}">
						<td>${productCart.storeProduct.product.name}</td>
						<td>${productCart.storeProduct.product.spec}</td>
						<td>${productCart.count}</td>
						<td>${productCart.storeProduct.product.retail_price}</td>
						<td><a data-role="button" data-inline="true"
							data-icon="delete" data-iconpos="notext"
							onclick="cashPro.deleteTr('确定删除产品：${productCart.storeProduct.product.name}?','${productCart.storeProduct.id}','system')">删除</a>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		<div class="pagination">${page}</div>
		<form:form id="inputForm" modelAttribute="systemProduct" method="post">
			<form:hidden path="storeProduct.id" id="productID" />
			<div data-role="fieldcontain">
				<label>产品名称</label>
				<fieldset data-role="controlgroup" data-type="horizontal"
					data-inline="true">
					<form:input type="text" readonly="true" id="productName"
						path="storeProduct.product.name" class="required" />
					<a id="selectButton" href="#selectProduct" data-role="button"
						data-rel="popup" data-position-to="window" data-transition="pop">选择产品</a>
				</fieldset>
			</div>
			<div data-role="fieldcontain">
				<label>产品规格</label>
				<form:input path="storeProduct.product.spec" type="text"
					id="productSpec" readonly="true" />
			</div>
			<div data-role="fieldcontain">
				<label>零售价格</label>
				<form:input path="storeProduct.product.retail_price" type="text"
					id="productRetailPrice" readonly="true" />
			</div>
			<div data-role="fieldcontain">
				<label>购买数量</label>
				<form:input path="count" type="text" />
			</div>
			<div data-role="fieldcontain">
				<label>服务专员:</label>
				<form:select id="employeeProductID" path="employee.id"
					name="employeeProductID">
					<c:forEach var="employee" items="${employees}">
						<option value="${employee.id}"
							${employee.id==storeProduct.employee.id?'selected':''}>
							${employee.name}</option>
					</c:forEach>
				</form:select>
			</div>
			<div id="okbutton">
				<button type="submit" data-inline="true">确认添加</button>
			</div>
			<div class="icon-buttons">
				<a data-role="button" data-inline="true" data-icon="check"
					data-iconpos="notext"
					href="${ctx}/cash/member/detail?id=${member.customer.id}">返回</a>
			</div>
		</form:form>
	</div>

	<div data-role="popup" id="selectProduct">
		<div data-role="header">
			<h1>选择产品</h1>
		</div>
		<div data-role="content"
			style="overflow:scroll;height:25em;width:20em;"
			id="selectProductEvent">
			<ul data-role="listview" id="productsList" data-filter="true" data-filter-placeholder="搜索">
			</ul>
		</div>
		<!-- /content -->
		<div data-role="footer">
			<a href="#" data-rel="back" data-role="button" data-inline="true"
				data-icon="back">取消</a>
		</div>
	</div>
	<!-- /page popup -->
</body>
</html>
